<!DOCTYPE HTML>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    	<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=yes" />
		<meta http-equiv="X-UA-Compatible" content="IE=Edge，chrome=1" />	
		<title>觅跑</title>
		<meta name="keywords" content="觅跑—砸蛋抽奖">
		<meta name="description" content="觅跑—砸蛋抽奖">
		<meta name="Copyright" content="觅跑—砸蛋抽奖">
		<meta name="author" content="觅跑—砸蛋抽奖">
		<meta http-equiv="windows-Target" contect="_top">
		<meta name="apple-mobile-web-app-capable" content="yes" />
		<meta name="applicable-device" content="pc,mobile">
		<meta http-equiv="Cache-Control" content="no-siteapp">
		<!-- 网站的ico图标 -->
		<link rel="shortcut icon" href="img/mipao.ico" type="image/x-icon">
		<link href="css/common.css" rel="stylesheet" type="text/css">
		<link href="css/publi.css" rel="stylesheet" type="text/css">
		<link href="css/chuyouwuyi02.css" rel="stylesheet" type="text/css">
		<!--<script type="text/javascript">
			var phoneWidth = parseInt(window.screen.width);
			var phoneScale = phoneWidth / 640;
			var ua = navigator.userAgent;
			if (/Android (\d+\.\d+)/.test(ua)) {
				var version = parseFloat(RegExp.$1);
				// andriod 2.3
				if (version > 2.3) {
					document.write('<meta name="viewport" content="width=640, minimum-scale = ' + phoneScale + ', maximum-scale = ' + phoneScale + ', target-densitydpi=device-dpi">');
					// andriod 2.3以上
				} else {
					document.write('<meta name="viewport" content="width=640, target-densitydpi=device-dpi">');
				}
				// 其他系统
			} else {
				document.write('<meta name="viewport" content="width=640, user-scalable=no, target-densitydpi=device-dpi">');
			}
		</script>-->
		<!--[if lt IE 9]>
		<script src="js/html5.js"></script>
		<script src="js/respond.min.js"></script>
		<![endif]-->
	</head>
	<body>
		<!-- ====================================loading -->
		<!--<section id="loading"></section>-->
		<!-- ====================================页面开始 -->
		<!--登录-->
		<section class="zadan">
			<div class="zd_logo">
				<img src="img/logo.png">
			</div>
			<div class="zd_middle">
				<div class="zd_title">
					<img src="img/title.png">
				</div>
                <div class="za_box">
                    <div class="zd_zadan">
                        <div class="zd_bg">
                            <img src="img/zd_cion18.png"  class="zd_bg01">
                            <img src="img/zd_cion18.png"  class="zd_bg02">
                        </div>
                        <div class="zd_jiangpin">
                            <img src="img/jiangpin.png"/>
                        </div>
                        <div class="zd_jindan ">
                            <img src="img/zd_cion16.png">
                        </div>
                        <ul class="zd_bigcaidai">
                            <li class="cardai01 cardai">
                                <img src="img/zd_cion15.png">
                            </li>
                            <li class="cardai02 cardai">
                                <img src="img/zd_cion14.png">
                            </li>
                            <li class="cardai03 cardai">
                                <img src="img/zd_cion13.png">
                            </li>
                            <li class="cardai04 cardai">
                                <img src="img/zd_cion12.png">
                            </li>
                            <li class="cardai05 cardai">
                                <img src="img/zd_cion11.png">
                            </li>
                            <li class="cardai06 cardai">
                                <img src="img/zd_cion10.png">
                            </li>
                        </ul>
                        <div class="zd_chuizi">
                            <img src="img/zd_cion01.png">
                        </div>
                        <div class="zd_txt">
                            <input class="name" type="text"  placeholder="姓名" />
                            <input class="phone"  type="text" id="iphone1" placeholder="手机号" />
                            <input class="submit mom_btn tc" id="submit"  type="button" />
                                <!--<img src="img/zd_cion07.png">-->
                            </a>
                        </div>
                    </div>
                </div>
			</div>

		</section>
		<!--弹出层-->
		<article id="tip">
			<div class="pack pack_yl">
				<p class="tc"></p>
				<a class="dengji" href="#"></a>
			</div>
		</article>
		<!-- 网站要用到的一些类库 -->
		<script type="text/javascript" src="js/jquery.min.js"></script>
		<script type="text/javascript" src="js/admin.js"></script>
		<script type="text/javascript" src="js/layer/layer.js"></script>
		<script type="text/javascript">
			var api="http://localhost:8085/lottery/lotty/validate";
			var getPrize="http://localhost:8085/lottery/lotty/getPrize";
			// http://192.168.1.144:8085/lottery/lotty/validate?phonenum=18310857630&username=
			var checkPhone = function(a) {
				var patrn = /^((?:13|15|18|14|17)\d{9}|0(?:10|2\d|[3-9]\d{2})[1-9]\d{6,7})$/;
				if (!patrn.exec(a)) return false;
				return true;
			};
			$(function() {
				$(window).on("load", function() {
						$("#loading").fadeOut();
					})
					// ========================================浮层控制
				$("#tip ").on("click", function() {
					$("#tip").fadeOut()
					$("#tip .pack p").html("")
					return false;
				})
				function alerths(str) {
					$("#tip").fadeIn()
					$("#tip .pack p").html(str)
					return false;
				}
				$("#submit").on("click", function() {
					var obj = $("#submit");
					$("#submit").attr("disabled", true); 
					$('html,body').animate({scrollTop:0}); 
					var str = $("#iphone1").val()
					if (str.length == 11 && checkPhone(str)) {
						// 判断是不是11位手机号，为真提交
						$(".zd_jindan").addClass("zd_jindan01");
						$(".cardai01").fadeIn(500);
						$(".cardai02").animate({
							top: '31%',
							left: '5%'
						}, 500);
						$(".cardai03").animate({
							top: '0',
							left: '0'
						}, 600);
						$(".cardai04").animate({
							top: '-11%',
							left: '6%'
						}, 700);
						$(".cardai05").animate({
							top: '3%',
							left: '20%'
						}, 800);
						$(".cardai06").animate({
							top: '50%',
							left: '30%'
						}, 1000, function() {
							var phone=$('.phone').val();
							var name=$('.name').val();
							// console.log(name,phone);
							var data={};
							data.phonenum=phone;
							data.username=name;
							 $.ajax({
								type:"get",
								url:api,
								data:data,
								dataType: "json",
								success:function(res){
									if(res.status===0){
										var datas={};
										datas.phonenum=phone;
										$.ajax({
											type:"get",
											url:getPrize,
											data:datas,
											dataType: "json",
											success:function(res){
												if(res.status===2){
													layer.msg("您已领过"+res.data.prizeName, { icon:1, time:1500 },function(){
														$(".zd_jindan").removeClass("zd_jindan01");
														$(".zd_bigcaidai").hide();
													})
												}
												else{
													$(".cardai").addClass("cardai07");
											 		$(".zd_jindan").removeClass("zd_jindan01");
												  	alerths(res.data);
												  	$(".dengji").html("恭喜您获得"+res.data);
													settime(obj);
												}
											}
										})
									}else{
										layer.msg(res.message, { icon: 2, time:1500 });
										$(".zd_jindan").removeClass("zd_jindan01");
										$(".zd_bigcaidai").hide();
										settime(obj);
							
									}
								}
							 })
							
						});
					
					} else {
						layer.msg("请输入正确的手机号", { icon: 2, time:1500 }, function () {
							$(".phone").focus();
							$(".phone").val('');
						});
					}
					return false;
				})
			 })
			    // var currentIndex = 0;  
				// $("#submit").on("click", function() {
				// 		if(currentIndex>=96){   
				// 			return;  
				// 		}  
				// 		console.log(currentIndex);  
				// 		$.ajax({  
				// 			type: 'get',  
				// 			url:api,  
				// 			dataType: "json",  
				// 			async: false,  
				// 			cache: true,  
				// 			success: function(json){  
				// 				currentIndex++;  
				// 				console.log("test");  
				// 			},  
				// 			error: function(data){  
				// 				console.log("error...");  
				// 				currentIndex++;  
				// 				alert('请求失败')
				// 			}  
				// 		})
				// })
				// $("#submit").on("click", function() {
				// 	var phoneBox=new Array(1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,91,92,93,94) 
				// 	for(var i=0;i<phoneBox.length;i++){
				// 		console.log(phoneBox[i]);
				// 		// var data={};
				// 		// data.phonenum=phoneBox[i];
				// 		// console.log(data)
				// 		$.ajax({
				// 			type:'get',
				// 			url:getPrize,
				// 			dataType:'json',
				// 			async: false,
				// 			data:{
				// 				"phonenum":phoneBox[i]
				// 			},
				//       		cache: true,
				// 			  success:function(res){
				// 				  console.log(res);

				// 			  }
				// 		})

				// 	}
				// })
			

		</script>
	</body>
</html>